<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <title>Natural Variation Haplotype Map App</title>

    <link type="text/css" rel="stylesheet" href="https://informatics-apps.systemsbiology.net/jquery-ui-1.8.16/theme/base/jquery.ui.all.css">
    <link type="text/css" rel="stylesheet" href="https://informatics-apps.systemsbiology.net/jquery-ui-1.8.16/demos.css">

    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/d3js-2.3.4/d3.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/d3js-2.3.4/d3.layout.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-1.4.3/jquery.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-plugins-jlin/jquery.blockUI.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-plugins-jlin/jquery.qtip.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-plugins-jlin/jquery.combobox.js"></script>
    <script type="text/javascript" src="./js/communicate.js"></script>
    <script type="text/javascript" src="./js/data.js"></script> 
    <script type="text/javascript" src="./js/hap_jqd3.js"></script> 
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-ui-1.8.16/jquery.ui.core.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-ui-1.8.16/jquery.ui.widget.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-ui-1.8.16/jquery.ui.tabs.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-ui-1.8.16/jquery.ui.mouse.js"></script>
    <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/jquery-ui-1.8.16/jquery.ui.slider.js"></script>

    <link rel="stylesheet" type="text/css" href="./css/style.css"/>


      <link rel="stylesheet" type="text/css" href="https://informatics-apps.systemsbiology.net/ext-js-3.4.0/resources/css/ext-all.css">
      <link rel="stylesheet" type="text/css" href="https://informatics-apps.systemsbiology.net/ext-js-3.4.0/examples/shared/examples.css"/>
      <link rel="stylesheet" type="text/css" href="/css/stylesheet.css"/>
      <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/ext-js-3.4.0/adapter/ext/ext-base.js"></script>
      <script type="text/javascript" src="https://informatics-apps.systemsbiology.net/ext-js-3.4.0/ext-all.js"></script>
      <script type="text/javascript" src="/js/topbar.js"></script>
      <script type="text/javascript" src="/js/widgets.js"></script>
      <script type="text/javascript">
          Ext.onReady(function() {
              new org.systemsbiology.addama.js.TopBar({ contentEl: "container_topbar" });
              org.systemsbiology.addama.js.Message.show("Systems Genetics", "Welcome to HapApp");
          });
      </script>

    <script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-26876458-1']);
  _gaq.push(['_trackPageview']);
  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
  </head>
  <body>
  <div id="container_topbar"></div>
  <div class="wrapper" >
        <div class="topbar" align="right">
          <a href="http://www.yeastgenome.org/">SGD</a>
          <a href="http://www.sciencemag.org/content/331/6020/1015" target='blank'>Systems Genetics</a>
	  <a href="http://code.google.com/p/systemsgenetics-haplotype" target='blank'>Manual/Source</a>
          <a href="http://www.systemsbiology.org/scientists_and_research/faculty_groups/Dudley_Group target='blank'">Dudley Group</a>
        </div>
<div class = 'iTitle'>Saccharomyces cerevisiae <i>natural variation</i> hapapp</div>
<div id="menu0" style="" class="menu">
&nbsp;<b>Cross</b>&nbsp;<select size="1" id="region_type_selector" onchange="updateYCR(this.value);return false;">
    <option value="YCR6">Soil_IL:Beer_Ireland</option>
   <!-- <option value="YCR5">Chocolate_SoilRedCanyon</option>-->
    </select>
&nbsp;<label for="chromosome"><b>Chr</b></label> <select input id="chromosome" size="1">
<option value="01">1</option>
    <option value="02">2</option>
    <option value="03">3</option>
    <option value="04">4</option>
    <option value="05">5</option>
    <option value="06">6</option>
    <option value="07">7</option>
    <option value="08">8</option>
    <option value="09">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="mt">mt</option>
    <option value="ALL">ALL</option>
</select>
&nbsp;<label for="markers"><b>Markers</b></label> <input id="markers" type="text" size="60" value="All" >
&nbsp;<b>Layout</b>&nbsp;<select size="1" id="marker_layout" onchange="updateLayout(this.value);return false;">
    <option value="Bin">Bin</option>
    <option selected value="Physical">Physical</option>
    </select>
</div> <!-- end of menu0-->
<div id="menu1" style="" class="menu">
&nbsp;<b>Progeny Signature</b>&nbsp;<select size="1" id="signature_list" onchange="updateProgenyList(this.value);return false;">
    <option value="RAP1_GCD7">MLN_Beta1</option>
    <option value="TEST">TOR1</option>
    <option value="GCN4">GCN4</option>
    <option value="TETRAD1">Tetrad1</option>
    <option value="TETRAD2">Tetrad2</option>
    </select>
&nbsp;<b>List</b>&nbsp;<input type="text" size="100" id="progeny_list" value="YPG893 YPG990 YPG1089 YPG1109 YPG1113 YPG1125 YPG1136 YPG1154 YPG1207 YPG1209 YPG1211 YPG1272 YPG1287"/> <button class='button' onclick='JavaScript:hapGo()'>Go</button>
</div> <!-- end of menu1-->

<div class="hmcontainer" style="width:7000px">
<div id="tabs" style="overflow:scroll">
	<ul>
	<!--	<li><a href="#tabs-1">References and Relationships</a></li> -->
		<li><a href="#tabs-2">Haplotype Calls</a></li>
		<li><a href="#tabs-3">Strains</a></li>
	</ul>
<!--	<div id="tabs-1">
		<div class='strain_detail' id='parent_detail_div'><b>Parent Details</b><br>Soil,IL-01, NV 17<br>SPS2:EGFP:kanMX4 HO ::HYG<br>Soil, Cahokia, IL, USA (2003)<br><br>BeerCLIB382, NV 39<br>SPS2:EGFP:natMX4 HO::dsdMX4<br>Ireland, brewery, super-attenuated beer, pre-1952</div>
</div> -->
	<div id="tabs-2" >
		<div class='strain_detail' id='parent_detail_div'><b>Parent Details</b><br>Soil,IL-01, NV 17<br>SPS2:EGFP:kanMX4 HO ::HYG<br>Soil, Cahokia, IL, USA (2003)<br><br>Beer, CLIB382, NV 39<br>SPS2:EGFP:natMX4 HO::dsdMX4<br>Ireland, brewery, super-attenuated beer, pre-1952<br></div>
	<br><b><p><font size="+1" color="#2B60DE">Blue ParentA</font>
<font size="+1" color="#306EFF"> Inferred</font>&nbsp;<font size="+1"  color="#E41B17">Red ParentB</font> <font size="+1"  color="red">Inferred</font> <br>
<font size="+1" color="grey">Grey Lowreads</font> <font size="+1" color="green">Green Ambiguous</font><br><font size="+1" color="purple">Purple Recombination</font> <font size="+1" color="#9E7BFF">Inferred</font> </p></b>	
	<div id="hapmarkers"></div><div id="hapcalls"></div><div id="slider-range"></div><div id="gbrowse-input"></div>
	</div>
	<div id="tabs-3" style="overflow:scroll">
                <div id="denddiv"></div>
        </div>
</div> 
<!-- end of tabs -->
<br>
Conditions&nbsp;<select size="1" id="pheno_selector" size='11' onchange="updatePheno(this.value);return false;">
    <option value="YPD">YPD</option>
    <option value="RAP">YPD+Rapamycin</option>
    <option value="SD">MinMedia-SD</option>
    <option value="10AT">MinMedia_10mM 3-aminotrizol</option>
    <option value="25AT">MinMedia_25mM 3-aminotrizol</option>
    </select>
<br><b>Growth Images for Soil and Beer: Days 1, 2, 3, 4, 5</b><br>
        <div class="img" id="ypgimgcontainer"><a target="_blank" href="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day1/YPD.jpg"><img src="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day1/YPD.jpg" alt="day1ypg" width="110" height="90" /></a>
 <div class="desc">stats</div></div>
<div class="img"><a target="_blank" href="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day2/YPD.jpg"><img src="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day2/YPD.jpg" alt="day2ypg" width="110" height="90" /></a><div class="desc">stats</div></div>
<div class="img">
<a target="_blank" href="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day3/YPD.jpg"><img src="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day3/YPD.jpg" alt="day3ypg" width="110" height="90" /></a><div class="desc">stats</div></div>
<div class="img"><a target="_blank" href="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day4/YPD.jpg"><img src="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day4/YPD.jpg" alt="day4ypg" width="110" height="90" /></a><div class="desc">stats</div></div>
<div class="img"><a target="_blank" href="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day5/YPD.jpg"><img src="http://systemsgenetics.systemsbiology.net/yeastImage/colonyPages/YPG993A/Day5/YPD.jpg" alt="day5ypg" width="110" height="90" /></a><div class="desc">stats</div></div>

<!-- end of image -->
<br>
</div> <!-- end of demo -->

<div class="push"></div>
</div> <!-- end of content -->
</div>
<div class="bottomcontact"><p>Copyright &copy; 2011 <a href="http://www.systemsbiology.org/scientists_and_research/faculty_groups/Dudley_Group">Dudley Group[at]ISB</a><a href="mailto:adudley@systemsbiology.org">&nbsp;&nbsp;Contact us</a></p></div>
    </div>

  </body>
</html>

